import React from "react";
import { Tabs, Space, Menu, Input, DatePicker, Select, Dropdown, Form, Button, Empty, Row, Col } from "antd";
import { DownOutlined, SmileOutlined } from '@ant-design/icons';
import TheButton from "@/components/TheButton";
import TheTable from "@/components/TheTable";
import ThePagination from "@/components/ThePagination";
import "@/views/commodity/style/style.less";
import { apiGetOrderList, apiGetPersonnelList, apiGetSendOrders, apiOnlineExportCapitalDaily, apiOnlineExportOrderDetail } from '@/request/orderManagement'
import { apiExportLibraryOutReport, } from '@/request/cashier'
import store from "@/store/store"

import { getDateTime3 } from '@/utils/getDate'
import TheDialog from '@/components/TheDialog'
import { exportTable, exportSheetTable } from '@/utils/exportTable.js'
import Json2Excel from '@/utils/Json2Excel.js'
import moment from "moment";

const { RangePicker } = DatePicker;
const { Search } = Input;
const { TabPane } = Tabs;
const now = moment(new Date().getTime()).format("YYYY-MM-DD");
const MonthDate = new Date();
MonthDate.setDate(1); //set设置时间
MonthDate.setHours(0);
MonthDate.setSeconds(0);
MonthDate.setMinutes(0);
const firstMonth = moment(MonthDate.getTime()).format("YYYY-MM-DD")
class TakeTheirList extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      exportLoading: false,
      orderState: '99',
      columns99: [
        {
          title: "订单编号",
          dataIndex: "orderCode",
          key: "orderCode",
        },
        {
          title: "用户昵称",
          dataIndex: "orderMemberName",
          key: "orderMemberName",
        },
        {
          title: "用户手机号",
          dataIndex: "memberMobile",
          key: "memberMobile",
        },
        {
          title: "订单金额（元）",
          dataIndex: "orderTotalPrice",
          key: "orderTotalPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderTotalPrice} />
          }
        },
        {
          title: "优惠券名称",
          dataIndex: "couponTitle",
          key: "couponTitle",
          render: (text, render) => {
            return render.couponTitle ? render.couponTitle : "-"
          }
        },
        {
          title: "优惠金额",
          dataIndex: "couponTotal",
          key: "couponTotal",
          render: (text, render) => {
            return <React.$Price price={render.couponTotal} />
          }
        },
        {
          title: "实付金额（元）",
          dataIndex: "orderPayPrice",
          key: "orderPayPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderPayPrice} />
          }
        },
        {
          title: "付款方式",
          dataIndex: "payWay",
          key: "payWay",
          render: (text, render) => {
            let label = ''
            switch (render.payWay) {
              case 'WeChat':
                label = '微信'
                break;
              case 'Alipay':
                label = '支付宝'
                break;
              case 'UnionPay':
                label = "银联"
                break;
              case 'YsPay':
                label = "银行卡支付"
                break;
              case 'RemoteAlipay':
                label = "扫码支付（支付宝）"
                break;
              case 'RemoteWeChat':
                label = "扫码支付（微信）"
                break;
              default:
                label = "未知支付方式"
            }
            return label;
          }
        },
        {
          title: "收货方式",
          dataIndex: "pickupWay",
          key: "pickupWay",
          render: (text, render) => {
            let label = ""
            switch (render.pickupWay) {
              case 'D':
                label = "到店自取"
                break;
              case 'T':
                label = '同城配送'
                break
              case 'U':
                label = '上门服务'
                break
              default:
                label = "/"
            }
            return label;
          }
        },
        {
          title: "订单时间",
          dataIndex: "createTime",
          key: "createTime",
        },
        {
          title: "订单状态",
          dataIndex: "orderState",
          key: "orderState",
          render: (text, render) => {
            let label = ''
            switch (render.orderState) {
              case '0':
                label = ''
                break;
              case '2':
                label = '未使用'
                break;
              case '3':
                label = "待接单"
                break;
              case '9':
                label = "已使用"
                break;
              default:
                label = ""
            }
            return label;
          }
        },
        {
          title: "核销时间",
          dataIndex: "finishTime",
          key: "finishTime",
        },
        {
          title: "操作",
          fixed: "right",
          render: (text, render) => {
            return (
              <div>
                <TheButton
                  hasPermi={['cashier:takeTheirList:view']}
                  onClick={() => this.props.history.push(`/order/details/${render.orderId}`)}
                >
                  查看订单
                </TheButton>
              </div>
            );
          },
        },
      ],
      columns2: [
        {
          title: "订单编号",
          dataIndex: "orderCode",
          key: "orderCode",
        },
        {
          title: "用户昵称",
          dataIndex: "orderMemberName",
          key: "orderMemberName",
        },
        {
          title: "用户手机号",
          dataIndex: "memberMobile",
          key: "memberMobile",
        },
        {
          title: "订单金额（元）",
          dataIndex: "orderTotalPrice",
          key: "orderTotalPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderTotalPrice} />
          }
        },
        {
          title: "优惠券名称",
          dataIndex: "couponTitle",
          key: "couponTitle",
          render: (text, render) => {
            return render.couponTitle ? render.couponTitle : "-"
          }
        },
        {
          title: "优惠金额",
          dataIndex: "couponTotal",
          key: "couponTotal",
          render: (text, render) => {
            return <React.$Price price={render.couponTotal} />
          }
        },
        {
          title: "实付金额（元）",
          dataIndex: "orderPayPrice",
          key: "orderPayPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderPayPrice} />
          }
        },
        {
          title: "付款方式",
          dataIndex: "payWay",
          key: "payWay",
          render: (text, render) => {
            let label = ''
            switch (render.payWay) {
              case 'WeChat':
                label = '微信'
                break;
              case 'Alipay':
                label = '支付宝'
                break;
              case 'UnionPay':
                label = "银联"
                break;
              case 'YsPay':
                label = "银行卡支付"
                break;
              case 'RemoteAlipay':
                label = "扫码支付（支付宝）"
                break;
              case 'RemoteWeChat':
                label = "扫码支付（微信）"
                break;
              default:
                label = "未知支付方式"
            }
            return label;
          }
        },
        {
          title: "收货方式",
          dataIndex: "pickupWay",
          key: "pickupWay",
          render: (text, render) => {
            let label = ""
            switch (render.pickupWay) {
              case 'D':
                label = "到店自取"
                break;
              case 'T':
                label = '同城配送'
                break
              case 'U':
                label = '上门服务'
                break
              default:
                label = "/"
            }
            return label;
          }
        },
        {
          title: "订单时间",
          dataIndex: "createTime",
          key: "createTime",
        },
        {
          title: "订单状态",
          render: () => {
            return '未使用'
          }
        },
        {
          title: "核销时间",
          dataIndex: "finishTime",
          key: "finishTime",
        },
        {
          title: "操作",
          fixed: "right",
          render: (text, render) => {
            return (
              <div>
                <TheButton
                  hasPermi={['cashier:takeTheirList:view']}
                  onClick={() => this.props.history.push(`/order/details/${render.orderId}`)}
                >
                  查看订单
                </TheButton>
              </div>
            );
          },
        },
      ],
      columns3: [
        {
          title: "订单编号",
          dataIndex: "orderCode",
          key: "orderCode",
        },
        {
          title: "用户昵称",
          dataIndex: "orderMemberName",
          key: "orderMemberName",
        },
        {
          title: "用户手机号",
          dataIndex: "memberMobile",
          key: "memberMobile",
        },
        {
          title: "订单金额（元）",
          dataIndex: "orderTotalPrice",
          key: "orderTotalPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderTotalPrice} />
          }
        },
        {
          title: "优惠券名称",
          dataIndex: "couponTitle",
          key: "couponTitle",
          render: (text, render) => {
            return render.couponTitle ? render.couponTitle : "-"
          }
        },
        {
          title: "优惠金额",
          dataIndex: "couponTotal",
          key: "couponTotal",
          render: (text, render) => {
            return <React.$Price price={render.couponTotal} />
          }
        },
        {
          title: "实付金额（元）",
          dataIndex: "orderPayPrice",
          key: "orderPayPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderPayPrice} />
          }
        },
        {
          title: "付款方式",
          dataIndex: "payWay",
          key: "payWay",
          render: (text, render) => {
            let label = ''
            switch (render.payWay) {
              case 'WeChat':
                label = '微信'
                break;
              case 'Alipay':
                label = '支付宝'
                break;
              case 'UnionPay':
                label = "银联"
                break;
              case 'YsPay':
                label = "银行卡支付"
                break;
              case 'RemoteAlipay':
                label = "扫码支付（支付宝）"
                break;
              case 'RemoteWeChat':
                label = "扫码支付（微信）"
                break;
              default:
                label = "未知支付方式"
            }
            return label;
          }
        },
        {
          title: "收货方式",
          dataIndex: "pickupWay",
          key: "pickupWay",
          render: (text, render) => {
            let label = ""
            switch (render.pickupWay) {
              case 'D':
                label = "到店自取"
                break;
              case 'T':
                label = '同城配送'
                break
              case 'U':
                label = '上门服务'
                break
              default:
                label = "/"
            }
            return label;
          }
        },
        {
          title: "订单时间",
          dataIndex: "createTime",
          key: "createTime",
        },
        {
          title: "订单状态",
          render: (text, record) => {
            return record.deliveryState === 'Y' ? '已派送' : record.deliveryState === 'N' ? '待派单' : '未知订单状态'
          }
        },
        {
          title: "核销时间",
          dataIndex: "finishTime",
          key: "finishTime",
        },
        {
          title: "操作",
          fixed: "right",
          render: (text, render) => {
            return (
              <div>
                <TheButton hasPermi={['cashier:takeTheirList:view']}
                  onClick={() => this.props.history.push(`/order/details/${render.orderId}`)}
                >
                  查看订单
                </TheButton>
                {render.deliveryState === 'N' && <TheButton hasPermi={['cashier:takeTheirList:send']} onClick={() => this.setState({ visible: true, orderId: render.orderId })}>派单</TheButton>}
              </div>
            );
          },
        },
      ],
      columns9: [
        {
          title: "订单编号",
          dataIndex: "orderCode",
          key: "orderCode",
        },
        {
          title: "用户昵称",
          dataIndex: "orderMemberName",
          key: "orderMemberName",
        },
        {
          title: "用户手机号",
          dataIndex: "memberMobile",
          key: "memberMobile",
        },
        {
          title: "订单金额（元）",
          dataIndex: "orderTotalPrice",
          key: "orderTotalPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderTotalPrice} />
          }
        },
        {
          title: "优惠券名称",
          dataIndex: "couponTitle",
          key: "couponTitle",
          render: (text, render) => {
            return render.couponTitle ? render.couponTitle : "-"
          }
        },
        {
          title: "优惠金额",
          dataIndex: "couponTotal",
          key: "couponTotal",
          render: (text, render) => {
            return <React.$Price price={render.couponTotal} />
          }
        },
        {
          title: "实付金额（元）",
          dataIndex: "orderPayPrice",
          key: "orderPayPrice",
          render: (text, render) => {
            return <React.$Price price={render.orderPayPrice} />
          }
        },
        {
          title: "付款方式",
          dataIndex: "payWay",
          key: "payWay",
          render: (text, render) => {
            let label = ''
            switch (render.payWay) {
              case 'WeChat':
                label = '微信'
                break;
              case 'Alipay':
                label = '支付宝'
                break;
              case 'UnionPay':
                label = "银联"
                break;
              case 'YsPay':
                label = "银行卡支付"
                break;
              case 'RemoteAlipay':
                label = "扫码支付（支付宝）"
                break;
              case 'RemoteWeChat':
                label = "扫码支付（微信）"
                break;
              default:
                label = "未知支付方式"
            }
            return label;
          }
        },
        {
          title: "收货方式",
          dataIndex: "pickupWay",
          key: "pickupWay",
          render: (text, render) => {
            let label = ""
            switch (render.pickupWay) {
              case 'D':
                label = "到店自取"
                break;
              case 'T':
                label = '同城配送'
                break
              case 'U':
                label = '上门服务'
                break
              default:
                label = "/"
            }
            return label;
          }
        },
        {
          title: "订单时间",
          dataIndex: "createTime",
          key: "createTime",
        },
        {
          title: "订单状态",
          render: () => {
            return '已使用'
          }
        },
        {
          title: "使用时间",
          dataIndex: "finishTime",
          key: "finishTime",
        },
        {
          title: "核销时间",
          dataIndex: "finishTime",
          key: "finishTime",
        },
        {
          title: "操作",
          fixed: "right",
          render: (text, render) => {
            return (
              <div>
                <TheButton
                  hasPermi={['cashier:takeTheirList:view']}
                  onClick={() => this.props.history.push(`/order/details/${render.orderId}`)}
                >查看订单</TheButton>
              </div>
            );
          },
        },
      ],
      dataSource99: [],
      dataSource2: [],
      dataSource3: [],
      dataSource9: [],
      pageData99: {
        pageNo: 1,
        pageSize: 10,
      },
      pageData2: {
        pageNo: 1,
        pageSize: 10,
      },
      pageData3: {
        pageNo: 1,
        pageSize: 10,
      },
      pageData9: {
        pageNo: 1,
        pageSize: 10,
      },
      total99: 0,
      total2: 0,
      total3: 0,
      total9: 0,
      tabData: [
        // {
        //   label: '待接单',
        //   value: '3'
        // },
        {
          label: '全部',
          value: '99'
        },
        {
          label: '未使用',
          value: '2'
        },
        {
          label: '已使用',
          value: '9'
        },
      ],
      searchValue: {
        orderMemberName: '',
        orderTypeName: '',
        orderCode: '',
        createTimeStart: "",
        createTimeEnd: "",
        finishTimeStart: "",
        finishTimeEnd: ''
      },
      visible: false,
      options: [],
      loading: false
    }
  }

  async componentDidMount() {
    let searchParams = store.getState().searchValue
    if (searchParams) {
      let { pageNo, pageSize, orderState, searchValue } = searchParams
      this.setState({
        orderState: orderState ? orderState : '99',
        searchValue: {
          ...searchParams,
          // createTimeStart: firstMonth,
          // createTimeEnd: now,
        },
        [`pageData${orderState}`]: {
          pageNo: pageNo, pageSize: pageSize
        }
      }, () => {

        this.getData()
      })
    } else {

      this.getData()

    }
    await this.getOptions()
  }
  getOptions = async () => {
    let res = await apiGetPersonnelList({ status: 'Y' })
    if (res.data && res.code === 0) {
      let options = res.data.map(v => {
        return {
          value: v.verificationPersonnelId,
          label: v.userName
        }
      })
      this.setState({ options })
    }
  }
  // 导出资金日报
  onlineExportCapitalDaily = async () => {
    this.setState({ exportLoading: true })
    let res = await apiOnlineExportCapitalDaily({ ...this.state.searchValue, pickupWay: 'U' })
    if (res.code === 0 && res.data) {
      const th_arr = [
        {
          title: '日期',
          prop: 'day'
        },
        {
          title: '计算方式',
          prop: '',
          children: res.data.payWay.map(item => {
            return {
              title: item.name,
              prop: item.value,
              valueType: 'n'

            }
          })
        }
        ,
        {
          title: '服务收入',
          prop: 'service',
          valueType: 'n'

        },
        {
          title: '商品收入',
          prop: 'good',
          valueType: 'n'

        },

        {
          title: '退款',
          prop: 'back', valueType: 'n'
        },

        {
          title: '总收入',
          prop: 'total', valueType: 'n'
        }]
      th_arr[1].children.push({
        title: "小计",
        prop: "paywayPrice", valueType: 'n'
      })
      const tb_arr = res.data.data.map(item => {
        return {
          ...item,
          paywayPrice: Number(item.paywayPrice).toFixed(2),
          total: Number(item.total).toFixed(2) || '0'

        }
      })
      this.setState({ exportLoading: false })
      Json2Excel({ fileName: '资金日报（到店自提）', header: th_arr, dataSource: tb_arr, })
    }
  }
  // 导出资金日报订单
  onlineExportOrderDetail = async () => {
    this.setState({ exportLoading: true })
    const { searchValue, } = this.state
    let condition = ""
    if (searchValue.createTimeStart && searchValue.createTimeEnd || searchValue.finishTimeStart && searchValue.finishTimeEnd) {
      condition = searchValue
    } else {
      let now = moment(new Date().getTime()).format("YYYY-MM-DD");
      console.log(now);
      let MonthDate = new Date();
      MonthDate.setDate(1); //set设置时间
      MonthDate.setHours(0);
      MonthDate.setSeconds(0);
      MonthDate.setMinutes(0);
      let firstMonth = moment(MonthDate.getTime()).format("YYYY-MM-DD")
      condition = {
        createTimeStart: firstMonth,
        createTimeEnd: now
      }
    }
    let res = await apiOnlineExportOrderDetail({ ...condition, pickupWay: 'U' })
    if (res.code === 0 && res.data) {
      let payWay = {}
      res.data.payWay.forEach(item => {
        payWay[item.value] = item.name
      })
      const th_arr = [
        {
          title: '资金日报订单（到店自提）',
          prop: '',
          children: [
            {
              title: '序号',
              prop: 'index',
              merge:true
            },
            {
              title: '订单编号',
              prop: 'orderCode',
              merge:true
            },
            {
              title: '订单状态',
              prop: 'orderState'
            },
            {
              title: '用户ID',
              prop: 'orderMemberId',
              merge:true
            },
            {
              title: '用户昵称',
              prop: 'orderMemberName',
              merge:true
            },
            {
              title: '用户手机号',
              prop: 'memberMobile',
              merge:true
            },
            {
              title: '注册时间',
              prop: 'memberCreatedTime',
              merge:true
            },
            {
              title: '物料ID',
              prop: 'materialId'
            },
            {
              title: '商品名称',
              prop: 'productName',
            },

            {
              title: '规格',
              prop: 'sku',
            },
            {
              title: '商品价格',
              prop: 'orderPrice', valueType: 'n'
            },
            {
              title: '商品数量',
              prop: 'orderProductCount', valueType: 'n'
            },
            {
              title: '付款方式',
              prop: 'payWay',
              merge:true
            },
            {
              title: '订单金额',
              prop: 'orderTotalPrice1', valueType: 'n',
              merge:true
            },
            {
              title: "优惠券名称",
              prop: "couponTitle",
              merge:true
            },
            {
              title: "优惠金额",
              prop: "couponTotal", valueType: 'n',
              merge:true
            },
            {
              title: '应付金额',
              prop: 'orderPayPrice', valueType: 'n',
              merge:true
            },
            {
              title: '实收金额',
              prop: 'realityPayPrice', valueType: 'n',
              merge:true
            },
            {
              title: '退款',
              prop: 'refundPrice', valueType: 'n',
              merge:true

            },
            {
              title: "退款时间",
              prop: 'refundTime',
              merge:true
            },

            {
              title: '订单类型',
              prop: 'type',
              merge:true
            },
            {
              title: '付款时间',
              prop: 'createTime',
              merge:true
            },
            {
              title: '核销时间',
              prop: 'finishTime',
              merge:true
            },
          ]
        },

      ]
      let tb_arr = []
      res.data.data.forEach(item => {
        if (item.salesReturnStatus === '9') {
          item.orderDetails.forEach(item2 => {
            tb_arr.push({
              index: item.index,
              orderCode: item.orderCode || '/',
              orderState: (item.orderState === '3' ? '待派单' : (item.orderState === '2' ? '未使用' : (item.orderState === '9' ? '已使用' : (item.orderState === '0' && item.salesReturnStatus === '9' ? '已退款' : '/')))) || '/',
              orderMemberId: item.orderMemberId || '/',
              orderMemberName: item.orderMemberName || '/',
              memberMobile: item.memberMobile,
              memberCreatedTime: item.memberCreatedTime,
              materialId: item2.materialId || '/',
              productName: item2.productName || '/',
              sku: item2.sku || '/',
              orderPrice: item2.orderPrice ? Number(item2.orderPrice).toFixed(2) : '0',
              orderProductCount: item2.orderProductCount || '/',
              payWay: payWay[item.orderPayWay] || '/',
              orderTotalPrice1: Number(item.orderTotalPrice).toFixed(2) || '/',
              couponTitle: item.couponTitle || '/',
              couponTotal: Number(item.couponTotal).toFixed(2) || '/',
              orderPayPrice: Number(item.orderPayPrice).toFixed(2) || '/',
              realityPayPrice: item.realityPayPrice ? Number(item.realityPayPrice).toFixed(2) : '0',
              refundPrice: item.refundDetailCount > 0 ? (item2.refundPrice ? Number(item2.refundPrice).toFixed(2) : '0') : (item.refundPrice ? Number(item.refundPrice).toFixed(2) : '0'),

              refundTime: item.refundDetailCount > 0 ? item2.refundTime || "/" : item.refundTime || "/",
              type: item.type || '/',
              createTime: item.day || '/',
              finishTime: item.finishTime,
              row_bgColor: "#C4C400",
              refundDetailCount: item.refundDetailCount
            })
          })
        } else {
          item.orderDetails.forEach(item2 => {
            tb_arr.push({
              index: item.index,
              orderCode: item.orderCode || '/',
              orderState: (item.orderState === '3' ? '待派单' : (item.orderState === '2' ? '未使用' : (item.orderState === '9' ? '已使用' : (item.orderState === '0' && item.salesReturnStatus === '9' ? '已退款' : '/')))) || '/',
              orderMemberId: item.orderMemberId || '/',
              orderMemberName: item.orderMemberName || '/',
              memberMobile: item.memberMobile,
              memberCreatedTime: item.memberCreatedTime,
              materialId: item2.materialId || '/',
              productName: item2.productName || '/',
              sku: item2.sku || '/',
              orderPrice: item2.orderPrice ? Number(item2.orderPrice).toFixed(2) : '0',
              orderProductCount: item2.orderProductCount || '/',
              payWay: payWay[item.orderPayWay] || '/',
              orderTotalPrice1: Number(item.orderTotalPrice).toFixed(2) || '/',
              couponTitle: item.couponTitle || '/',
              couponTotal: Number(item.couponTotal).toFixed(2) || '/',
              orderPayPrice: Number(item.orderPayPrice).toFixed(2) || '/',
              realityPayPrice: item.realityPayPrice ? Number(item.realityPayPrice).toFixed(2) : '0',
              refundPrice: item.refundDetailCount > 0 ? (item2.refundPrice ? Number(item2.refundPrice).toFixed(2) : '0') : (item.refundPrice ? Number(item.refundPrice).toFixed(2) : '0'),
              refundTime: item.refundDetailCount > 0 ? item2.refundTime || "/" : item.refundTime || "/",
              type: item.type || '/',
              createTime: item.day || '/',
              finishTime: item.finishTime,
              row_bgColor: "#fff",
              refundDetailCount: item.refundDetailCount

            })
          })
        }
      })
      this.setState({ exportLoading: false })

      // const mergeProp = [
      //   {
      //     key: 'index'
      //   }, {
      //     key: 'orderMemberId'
      //   }, {
      //     key: 'orderMemberName'
      //   }, {
      //     key: 'orderTotalPrice1'
      //   }, {
      //     key: 'couponTotal'
      //   }, {
      //     key: 'couponTitle'
      //   }, {
      //     key: 'orderCode'
      //   }, {
      //     key: 'realityPayPrice'
      //   }, {
      //     key: 'refundPrice',
      //     // reg: /^\s*$/g
      //     reg: /^0$/,
      //     regKey: 'refundDetailCount'
      //   }, {
      //     key: 'payWay'
      //   }, {
      //     key: 'orderPayPrice'
      //   }, {
      //     key: 'createTime'
      //   }, {
      //     key: 'finishTime'
      //   }, {
      //     key: 'type'
      //   }, {
      //     key: 'refundTime',
      //     // reg: /[^\/|^\s*]$/g
      //   }, {
      //     key: 'memberMobile'
      //   }, {
      //     key: 'memberCreatedTime'
      //   }
      // ]
      Json2Excel({ fileName: '资金日报订单（到店自提）', header: th_arr, dataSource: tb_arr,  })
    }
  }
  exportSaleOutTable = async (option) => {
    let res = await apiExportLibraryOutReport({
      ...this.state.searchValue, pickupWay: 'U'
    })
    if (res.code === 0 && res.data) {
      const th_arr = [
        {
          title: '序号',
          prop: 'productId'
        },
        {
          title: '日期',
          prop: 'day'
        },
        {
          title: '物料Id',
          prop: 'materialId',
        },
        {
          title: '库存单位',
          prop: 'unit'
        },
        {
          title: '实发数量',
          prop: 'orderProductCount', valueType: 'n'
        },
        {
          title: '含税单价',
          prop: 'orderPrice', valueType: 'n'
        }
      ]
      const tb_arr = res.data
      Json2Excel({ fileName: '销售出库单（到店自提）', header: th_arr, dataSource: tb_arr })

    }
  }
  getData = async () => {
    this.setState({ loading: true })
    const { orderState, searchValue } = this.state
    // if(!searchValue.createTimeStart ){
    //   searchValue.createTimeStart = firstMonth
    //   searchValue.createTimeEnd = now
    // }
    let params = {
      ...searchValue,
      orderState,

      ...this.state[`pageData${orderState}`],
      pickupWay: 'U'
    }

    store.dispatch({
      type: 'SaveSearchValues',
      data: {
        ...params
      }
    })
    let res = await apiGetOrderList({
      ...params
    })
    if (res.data && res.code === 0) {
      this.setState({
        [`pageData${orderState}`]: {
          pageNo: res.pageNo,
          pageSize: res.pageSize
        },
        [`dataSource${orderState}`]: res.data,
        [`total${orderState}`]: res.totalCount,
        loading: false
      })
    }
  }
  setTabKey = (orderState) => {
    this.setState({ orderState }, () => {

      this.getData()
    })
  };
  pageChange = (pageNo, pageSize, index) => {
    this.setState({
      [`pageData${index}`]: {
        pageNo,
        pageSize,
      },
    }, () => {
      let search = JSON.stringify(this.state.searchValue)

      this.getData()
    });
  };
  setNickName = e => {
    this.setState({
      searchValue: {
        ...this.state.searchValue,
        memberName: e
      },
      pageData2: {
        pageNo: 1,
        pageSize: 10
      },
      pageData3: {
        pageNo: 1,
        pageSize: 10
      },
      pageData9: {
        pageNo: 1,
        pageSize: 10
      },
    }, () => {
      this.getData()
    })
  }
  setProductId = e => {
    this.setState({
      searchValue: {
        ...this.state.searchValue,
        productId: e
      },
      pageData2: {
        pageNo: 1,
        pageSize: 10
      },
      pageData3: {
        pageNo: 1,
        pageSize: 10
      },
      pageData9: {
        pageNo: 1,
        pageSize: 10
      },
    }, () => {

      this.getData()
    })
  }
  setProductName = e => {
    this.setState({
      searchValue: {
        ...this.state.searchValue,
        productName: e
      },
      pageData2: {
        pageNo: 1,
        pageSize: 10
      },
      pageData3: {
        pageNo: 1,
        pageSize: 10
      },
      pageData9: {
        pageNo: 1,
        pageSize: 10
      },
    }, () => {

      this.getData()
    })
  }
  setOrderCode = e => {
    console.log(e, 'e');
    this.setState({
      searchValue: {
        ...this.state.searchValue,
        orderCode: e
      },
      pageData2: {
        pageNo: 1,
        pageSize: 10
      },
      pageData3: {
        pageNo: 1,
        pageSize: 10
      },
      pageData9: {
        pageNo: 1,
        pageSize: 10
      },
    }, () => {

      this.getData()
    })
  }
  datePickerChange = e => {

    if (e) {
      this.setState({
        searchValue: {
          ...this.state.searchValue,
          createTimeStart: getDateTime3(e[0]),
          createTimeEnd: getDateTime3(e[1])
        },
        pageData2: {
          pageNo: 1,
          pageSize: 10
        },
        pageData3: {
          pageNo: 1,
          pageSize: 10
        },
        pageData9: {
          pageNo: 1,
          pageSize: 10
        },
      }, () => {

        this.getData()
      })
    } else {
      this.setState({
        searchValue: {
          ...this.state.searchValue,
          createTimeStart: '',
          createTimeEnd: ''
        },
        pageData2: {
          pageNo: 1,
          pageSize: 10
        },
        pageData3: {
          pageNo: 1,
          pageSize: 10
        },
        pageData9: {
          pageNo: 1,
          pageSize: 10
        },
      }, () => {
        this.getData()
      })
    }
  }
  datePickerFinishChange = e => {

    if (e) {
      this.setState({
        searchValue: {
          ...this.state.searchValue,
          finishTimeStart: getDateTime3(e[0]),
          finishTimeEnd: getDateTime3(e[1])
        },
        pageData2: {
          pageNo: 1,
          pageSize: 10
        },
        pageData3: {
          pageNo: 1,
          pageSize: 10
        },
        pageData9: {
          pageNo: 1,
          pageSize: 10
        },
      }, () => {

        this.getData()
      })
    } else {
      this.setState({
        searchValue: {
          ...this.state.searchValue,
          finishTimeStart: '',
          finishTimeEnd: ''
        },
        pageData2: {
          pageNo: 1,
          pageSize: 10
        },
        pageData3: {
          pageNo: 1,
          pageSize: 10
        },
        pageData9: {
          pageNo: 1,
          pageSize: 10
        },
      }, () => {
        this.getData()
      })
    }
  }
  closeDialog = () => {
    this.setState({
      visible: false,
      orderId: '',
      btnLoading: false
    })
  }
  sendOrder = async value => {
    this.setState({ btnLoading: true })
    let { orderId } = this.state
    let res = await apiGetSendOrders({ orderId, ...value })
    if (res.code === 0) {
      React.$message({
        type: 'info',
        content: '派单成功'
      })
      this.closeDialog()
      this.getData()
    }
  }
  changeParams(e, key) {
    console.log(e, ';eee');
    this.setState({
      searchValue: {
        ...this.state.searchValue,
        [key]: e.target.value
      }
    })
  }
  render() {
    const { searchValue } = this.state
    const productId = searchValue.productId
    const productName = searchValue.productName
    const orderCode = searchValue.orderCode
    const memberName = searchValue.memberName
    const menu = (
      <Menu>
        <Menu.Item>
          <TheButton size="middle" type="link" hasPermi={['cashier:takeTheirList:exportDaily']} onClick={this.onlineExportCapitalDaily} loading={this.exportLoading}>导出资金日报</TheButton>

        </Menu.Item>
        <Menu.Item>
          <TheButton size="middle" type="link" hasPermi={['cashier:takeTheirList:exportDailyOrder']} onClick={this.onlineExportOrderDetail} loading={this.exportLoading}>导出资金日报订单</TheButton>

        </Menu.Item>
        <Menu.Item>
          <TheButton size="middle" type="link" hasPermi={['cashier:takeTheirList:sales']} onClick={this.exportSaleOutTable} loading={this.exportLoading}>导出销售出库单</TheButton>

        </Menu.Item>
      </Menu>)
    const operations = {
      right: (
        <Space >
          <Search
            value={productId}
            onChange={(e) => this.changeParams(e, 'productId')}
            onSearch={(e) => this.setProductId(e)}
            style={{ width: 150 }}
            placeholder={"商品id"}
            allowClear
            enterButton
          />
          <Search
            value={productName}
            onChange={(e) => this.changeParams(e, 'productName')}
            onSearch={(e) => this.setProductName(e)}
            style={{ width: 150 }}
            placeholder={"商品名称"}
            allowClear
            enterButton
          />
          <Search
            value={memberName}
            onChange={(e) => this.changeParams(e, 'memberName')}
            onSearch={(e) => this.setNickName(e)}
            style={{ width: 150 }}
            placeholder={"用户昵称"}
            allowClear
            enterButton
          />
          <Search
            value={orderCode}
            onChange={(e) => this.changeParams(e, 'orderCode')}
            onSearch={(e) => this.setOrderCode(e)}
            style={{ width: 180 }}
            placeholder={"请输入订单号"}
            allowClear
            enterButton
          />

          <div>
            <span>下单时间 </span>
            <RangePicker value={searchValue.hasOwnProperty('createTimeStart') && searchValue.createTimeStart ? [moment(searchValue.createTimeStart, 'YYYY/MM/DD'), moment(searchValue.createTimeEnd, 'YYYY/MM/DD')] : []} format={'YYYY/MM/DD'} onChange={(e) => this.datePickerChange(e)} />
          </div>
          <div>
            <span>核销时间 </span>
            <RangePicker value={searchValue.hasOwnProperty('finishTimeStart') && searchValue.finishTimeStart ? [moment(searchValue.finishTimeStart, 'YYYY/MM/DD'), moment(searchValue.finishTimeEnd, 'YYYY/MM/DD')] : []} format={'YYYY/MM/DD'} onChange={(e) => this.datePickerFinishChange(e)} />
          </div>




          <Dropdown overlay={menu}>
            <TheButton size="middle" type="default" onClick={(e) => e.preventDefault()}
              hasPermi={['cashier:takeTheirList:exportDaily', 'cashier:takeTheirList:sales', 'cashier:takeTheirList:exportDailyOrder']}
            >
              导出数据 <DownOutlined />
            </TheButton>
          </Dropdown>

          {/* <Search
            onSearch={(e) => this.setStoreName(e)}
            style={{ width: 150 }}
            placeholder={"门店名称"}
            allowClear
            enterButton
          /> */}



        </Space>
      ),
    };
    const { tabData, visible, options, btnLoading, loading, orderState } = this.state;
    return (
      <div className="p-layout-box">
        <Tabs
          activeKey={`${orderState}`}
          onChange={(value) => this.setTabKey(value)}
          tabBarExtraContent={operations}
        >
          {tabData.map((v, i) => {
            return (
              <TabPane tab={v.label} key={v.value} >
                <div className="p-layout-content-pagination">
                  <TheTable
                    scroll={{ x: "max-content" }}
                    columns={this.state[`columns${v.value}`]}
                    dataSource={this.state[`dataSource${v.value}`]}
                    loading={loading}
                  />
                  <ThePagination
                    pageNo={this.state[`pageData${v.value}`].pageNo}
                    pageSize={this.state[`pageData${v.value}`].pageSize}
                    total={this.state[`total${v.value}`]}
                    pageChange={(pageNo, pageSize) =>
                      this.pageChange(pageNo, pageSize, v.value)
                    }
                  />
                </div>
              </TabPane>
            );
          })}
        </Tabs>
        <TheDialog
          title="选择核销员"
          footer={null}
          handleCancel={this.closeDialog}
          visible={visible}
          width={400}
        >
          <Form onFinish={this.sendOrder}>
            <Form.Item name="verificationUserId" label="选择核销员" rules={[{ required: true }]}>
              <Select allowClear options={options} placeholder="选择核销员" />
            </Form.Item>
            <Form.Item>
              <div style={{ width: '100%', display: 'flex', justifyContent: 'flex-end', marginBottom: -30 }}>
                <Space>
                  <Button onClick={this.closeDialog}>取消</Button>
                  <Button loading={btnLoading} type="primary" htmlType="submit">确定</Button>
                </Space>
              </div>
            </Form.Item>
          </Form>
        </TheDialog>
      </div>
    );
  }
}

export default TakeTheirList;
